草庐IT

html - CSS 位置 :fixed inside a positioned element

全部标签

javascript - 从 DOM 中删除元素并将它们添加回原来的位置

我有一个模态窗口。我想要发生的是在模态打开时从页面中删除某些元素,并在模态关闭后将它们添加回原来的位置。我不想显示:无,因为那样只会隐藏它们,我需要将它们实际从页面中删除。所以我有一些jQuery可以删除并在计时器之后将它们添加回去只是为了测试......更新:通过对代码添加这些内容,它现在可以抓取之前的元素,然后将其添加回同一元素之后。问题是,如果该元素也被删除了怎么办?然后它不会添加回来!另外,JavaScript事件处理程序不会丢失吗?我正在开发一个插件,所以它应该尽可能少地干扰网站,但是3d元素在Safari中有一个无法解决的错误。关于如何暂时删除3d元素而又不会过多干扰人们的

javascript - 具有辅助功能的浏览器是否支持 CSS 或 JavaScript?

我目前正在研究一种蜜jar解决方案,以防止在我的网站中出现垃圾邮件,该解决方案包括添加一些具有随机名称的字段,并通过添加style="display:none;"用CSS隐藏它们在HTML元素中。提交时,如果这些字段中的任何一个不是空的——它应该是空的——这意味着垃圾邮件机器人刚刚提交了表单。那还是恶意用户。无论哪种方式,帖子都会被拒绝。现在,这会完美地工作,但我假设所有用户都拥有支持CSS的浏览器。通过JavaScript删除CSSdisplay属性等于none的每个字段可以防止不支持CSS的浏览器显示假定的隐藏字段。因此,这对于支持以下功能的浏览器来说效果很好:CSS和JavaSc

javascript - jquery 可拖动但在原始元素所在的位置保留副本

假设我在页面顶部有3个笑脸,L、M和R。在底部,我有一个目标框。它们之间有一条语句:“将中间的笑脸拖到目的地”。虽然draggable允许您这样做,但它拖动的是实际元素,而不是副本。当用户拖动笑脸时,我希望前3个保持静止,只有他们正在移动的那个的副本才能真正移动。如果需要,用户应该能够将多个副本拖到多个目标框中。基本上,我正在寻找这样的东西$("#drag-target-1").draggable('leave-copy'); 最佳答案 使用值为clone的辅助属性来启用可拖动元素的克隆。$("#drag-target-1").dr

javascript - 如何使用 CSS 随机旋转图像?

我的网页上有一个包含20张图片的画廊,我想在将鼠标悬停在每张图片上时随机旋转(-5到5度)。如果可能的话,我想只使用CSS。如果没有,我愿意使用JavaScript或jQuery。我的CSS如下:.photo:hover{z-index:1;transform:rotate(6deg)scale(1.25);-webkit-transform:rotate(6deg)scale(1.25);-moz-transform:rotate(6deg)scale(1.25);-ms-transform:rotate(6deg)scale(1.25);}6deg应该是一个随机数,所以每次用户将鼠

javascript - 如何用 jQuery 替换 HTML 但保留事件绑定(bind)

这与其说是一个具体的问题,不如说是一个战略性的问题,但我认为正是这样问的:假设我有一个包含3个独立部分的页面或ap。部分表单的更改会向服务器发送一个ajaxpost,这需要在第二部分进行更改。我想发回第2部分重新处理的HTML输出,并用它替换第2部分的原始状态但是,第2部分有许多元素具有更改、单击、拖动等绑定(bind)-根据经验,当我进行html替换时,我会丢失所有绑定(bind)。但是,这让我不得不单独重写第2部分中许多元素中的某些内容,以免丢失绑定(bind)。我知道有一个更简单的方法来解决这个问题,这似乎是一个常见问题。谁能给我提供这个问题的“啊哈”部分,也许还有一些例子或链接

javascript - 在 history.js 中强制回退 html4

我无法让html4Mode选项为我工作。我在一个非常简单的两页应用程序上使用ajaxify脚本(https://github.com/browserstate/ajaxify)。在支持html5的浏览器中一切正常,但如果我想出于测试目的强制使用html4回退,没有任何变化,似乎历史忽略了这些选项并继续使用html5推送状态url。为了强制回退,我只是更改了ajaxify脚本添加(在DOM上准备好):History.options.html4Mode=true;(我正在使用v1.8b1jqueryhtml4+5捆绑脚本)有没有办法让它工作? 最佳答案

javascript - CSS - 从不同的浏览器返回不同的值

当我使用jQuery获取对象的CSS值时,每个浏览器(IE、Mozilla、Chrome等)都返回不同的值。例如,在Chrome中,背景图像(.css("background-image"))返回:url(http://i41.tinypic.com/f01zsy.jpg)在Mozilla中,它返回:url("http://i41.tinypic.com/f01zsy.jpg")我在其他方面也有同样的问题,比如背景大小。在chrome中它返回:50%50%但是Mozilla返回:50%+50%我的问题是,我有拆分CSS(背景大小)的函数,例如基于空格.split(""),但这在Mozi

javascript - 如何获取包含图像的内容可编辑的 div 的插入符号位置

我有这个contentedittabledivminubyviubyvt这是代码输出的图像描述所以我想获取div的插入符号位置,并假设光标位于最后一个字符之后。这是我获取插入符位置的代码functiongetCaretPosition(editableDiv){varcaretPos=0,sel,range;if(window.getSelection){sel=window.getSelection();if(sel.rangeCount){range=sel.getRangeAt(0);if(range.commonAncestorContainer.parentNode==edi

javascript - 使 div 带有动画飞到另一个 DOM 位置

我正在移动来自大灰色的元素(Octopus)以上(#large)给小橘子下面(#small)使用$(document).on("click","#large>img",function(){$(this).appendTo("#small");});这很好用,但我希望它平滑过渡并“飞”过去,这样它会慢慢插入其坐标和大小。我尝试添加一个CSS过渡img{transition:all3s;}到我的,但这将不起作用,因为图像被重新添加到DOM而不是移动。这样的动画如何制作?JSFiddle 最佳答案 使用jQuery.append方法不允

javascript - Postcss-loader 没有缩小 css 输出

我正在使用webpack和postcss-loader自动添加前缀并缩小我的CSS,然后将其加载到css-loader以使用css-modules。我在缩小CSS时遇到问题。通过webpack检查发出的.js文件显示CSS未使用cssnano缩小(因为我仍然可以看到空白字符)。我做错了什么?一些相关的配置文件:webpack.config.js:constpath=require('path');constwebpack=require('webpack');varpostCompileScript=require('./postCompile');module.exports={en